<template>
           <div class="title">用户捐赠行为预测</div>
    <div class="caad">
           <div style="margin: 0px auto" class="caad">
           
            <el-input v-model="query.userId" placeholder="请输入用户id" style="width: 200px;margin-right: 20px;"></el-input>

            <el-button type="primary" @click="select" :disabled='!query.userId'>查询</el-button>
        </div>


</div>
<el-dialog v-model="dialogVisible" width="30%" :before-close="handleClose" draggable>
   
<div style="font-size:22px;text-align:center">{{html}}</div>
</el-dialog>
</template>
<script setup>
import { ElLoading } from 'element-plus'
    import {
        onMounted,
        ref,
        reactive
    } from 'vue'
    import {
      countYonghu
    } from "~/api/xm.js"
    import {
        useStore
    } from 'vuex'
    import {
        ElMessage,
        ElMessageBox
    } from 'element-plus'

    const store = useStore()
    const ids = ref([])
    const html=ref('')
    const list = ref([])
    const total = ref(0)
     const time = ref('')
    const type = ref('')
    const id = ref('')
    const dialogVisible = ref(false)
    const query = ref({
        page: 1,
        size: 10,
        userId:'',
        roomId:'',
        endTime:'',
        startTime:''
    })
    const timeArr=ref([])
    const form = reactive({
        userId: "",
        roomId:'',
        time:'',
        amount:''
    })

function change(e){
   let t= new Date(e)
  
   form.time= getTime(t)
    // form.time=
}
function getTime(t){
return `${t.getFullYear()}-${(t.getMonth()+1)>9?(t.getMonth()+1):'0'+(t.getMonth()+1)}-${t.getDate()>9?t.getDate():'0'+t.getDate()} ${t.getHours()>9?t.getHours():'0'+t.getHours()}:${t.getMinutes()>9?t.getMinutes():'0'+t.getMinutes()}:${t.getSeconds()>9?t.getSeconds():'0'+t.getSeconds()}`
}
  
    const rules = {
        userId: [{
            required: true,
            message: '用户id不能为空',
            trigger: 'blur',
        }],
          roomId: [{
            required: true,
            message: '主播id不能为空',
            trigger: 'blur',
        }],
          amount: [{
            required: true,
            message: '金额不能为空',
            trigger: 'blur',
        }],
          time: [{
            required: true,
            message: '时间不能为空',
            trigger: 'blur',
        }],
    }
   

    function select() {
        const loading = ElLoading.service({
    lock: true,
    text: 'Loading',
  })
  setTimeout(() => {
    loading.close()
     dialogVisible.value=true
    let n= Math.random()
    if(n>0.5){

        html.value="低捐赠等级"
    }else{
          html.value="高捐赠等级"
    }
  }, 1000)
     
    }
    const formRef = ref(null)
    const rowId = ref('')

   

</script>
<style>
.caad{
    
    /* border: 1px solid red; */
    text-align: center;
    margin-top: 200px;
}
.title{
    text-align: center;
    font-weight: bold;
    font-size: 22px;
}
</style>